<!doctype html>
<html>

<head>
    <meta charset="utf-8">
    <meta name="viewport" content="maximum-scale=1.0,minimum-scale=1.0,user-scalable=0,width=device-width,initial-scale=1.0" />
    <meta name="format-detection" content="telephone=no,email=no,date=no,address=no">
    <title>个人页面</title>
    <link href="../../css/Hui.css" rel="stylesheet" type="text/css" />
    <style type="text/css">
        /* 简单设置表单元素样式 */
        .form-item {
            display: flex;
            align-items: center;
            margin-bottom: 10px;
        }

        .form-label {
            width: 100px;
            text-align: right;
            padding-right: 10px;
        }

        .form-input {
            flex: 1;
            padding: 8px;
            border: 1px solid #ccc;
            border-radius: 3px;
        }

        .form-button {
            padding: 8px 15px;
            background-color: #f4f4f4;
            border: 1px solid #ccc;
            border-radius: 3px;
            cursor: pointer;
        }
    </style>
</head>

<body>

<div class="H-padding-vertical-bottom-10"></div>
<!--<header class="H-header H-theme-background-color9 H-padding-vertical-top-25" id="header">-->
<!--    <span onclick="goBack()" class="H-icon H-position-relative H-display-inline-block H-float-left H-vertical-middle H-theme-font-color-white H-padding-horizontal-left-5 H-z-index-100">-->
<!--			<i class="H-iconfont H-icon-target-back H-font-size-18 H-vertical-middle"></i>-->
<!--		</span>-->
<!--    <div class="H-header-title H-center-all H-font-size-18 H-text-show-row-1 H-theme-font-color-white-->
<!--            H-position-absolute H-width-100-percent">个人页面</div>-->
<!--</header>-->

<div class="H-padding-vertical-bottom-10"></div>

<div class="H-border-vertical-both-after">
    <div class="form-item">
        <span class="form-label">商家名：</span>
        <input type="text" class="form-input" id="merchantid" placeholder="展示商家名" disabled />
    </div>
    <div class="form-item">
        <span class="form-label">手机号：</span>
        <input type="text" class="form-input" id="mobile" placeholder="展示手机号" disabled />
    </div>
    <div class="form-item">
        <span class="form-label">密码：</span>
        <input type="password" class="form-input" id="password" placeholder="******" value="******" style="width: 80%;" disabled />
        <button class="form-button" onclick="location.href='/app/merchantresetpass'">修改</button>
    </div>
    <div class="form-item">
        <span class="form-label">到期时间：</span>
        <input type="text" class="form-input" id="registerTime" placeholder="展示到期时间" disabled />
    </div>
<!--    <div class="form-item">-->
<!--        <span class="form-label">客服电话：</span>-->
<!--        <input type="text" class="form-input" id="kfdh" placeholder="展示客服电话" value="" disabled />-->
<!--    </div>-->



    <div class="H-text-align-center H-margin-vertical-top-15 H-position-relative" style="height: 200px">
        <span onclick="logoutSys()" class="H-theme-font-color-red H-font-size-22
        H-margin-vertical-bottom-15 H-display-block H-theme-background-color-white H-position-absolute H-padding-vertical-both-10"
              style="left:10px;right:10px;">退出登录</span>
    </div>
</div>

<div class="H-padding-vertical-bottom-10" style="font-weight: bold;">

    <div class="H-border-vertical-top-after H-margin-vertical-bottom-10">

        <!-- 操作选择弹窗 -->
        <div class="action-popup" id="actionPopup" style="text-align: center;">
            客服电话：<div class="popup-item call-action" style="text-align: center;color: #1e9fff;display: inline">
            13283356657<i id="phoneNumber"></i>
        </div>
            <div class="popup-item copy-action">
                <i></i>
            </div>
        </div>
        <div class="mask" id="mask"></div>

    </div>
</div>



<script src="../script/H.js" type="text/javascript"></script>
<script src="../script/jquery-3.7.1.min.js" type="text/javascript"></script>
<script src="../plugins/swiper/swiper.min.js"></script>
<script src="../api.js" type="text/javascript"></script>
<script type="text/javascript">
    // 假设user是包含用户信息的对象，kfdh是客服电话变量
    var user = #(user);
    var kfdh = #(kfdh);
    $(document).ready(function () {
        // 给商家名输入框赋值
        $('#merchantid').val(user.realname);
        // 给手机号输入框赋值
        $('#mobile').val(user.mobile);
        // 给密码输入框赋值（如果需要展示密码，一般不建议直接展示明文）
        $('#password').val(user.password);
        // 给注册时间输入框赋值（假设user对象有对应字段）
        $('#registerTime').val(user.expiretime);
        // 给客服电话输入框赋值
        $('#kfdh').val(kfdh);
    });


    // 核心号码（无分隔符，用于功能调用）
    const phoneNumber = '13283356657';
    const phoneEl = document.getElementById('phoneNumber');
    const popupEl = document.getElementById('actionPopup');
    const maskEl = document.getElementById('mask');
    const callAction = document.querySelector('.call-action');
    const copyAction = document.querySelector('.copy-action');

    // 点击电话号码显示弹窗
    phoneEl.addEventListener('click', function(e) {
        e.stopPropagation(); // 阻止事件冒泡，避免点击弹窗外关闭
        showPopup();
    });

    // 显示弹窗
    function showPopup() {
        popupEl.style.display = 'block';
        maskEl.style.display = 'block';
    }

    // 隐藏弹窗
    function hidePopup() {
        // popupEl.style.display = 'none';
        // maskEl.style.display = 'none';
    }

    // 拨打电话功能
    callAction.addEventListener('click', function() {
        hidePopup();
// 移动端调用拨号功能
        if (/(Android|iPhone|iPad|iPod)/i.test(navigator.userAgent)) {
            location.href = `tel:${phoneNumber}`;
        }
// PC端提示
        else {
            alert('PC端无法直接拨打，请复制号码后手动拨号');
        }
    });

    // 复制号码功能
    copyAction.addEventListener('click', function() {
        hidePopup();
        navigator.clipboard.writeText(phoneNumber).then(() => {
            alert('号码已复制到剪贴板：' + phoneNumber);
        }).catch(() => {
            alert('复制失败，请手动输入：' + phoneNumber);
        });
    });

    // 点击弹窗外或遮罩层关闭弹窗
    maskEl.addEventListener('click', hidePopup);
    document.addEventListener('click', function(e) {
        if (!phoneEl.contains(e.target) && !popupEl.contains(e.target)) {
            hidePopup();
        }
    });
    
    
    function logoutSys() {

        var userId = localStorage.getItem("userId");
        localStorage.removeItem("user");
        localStorage.removeItem("userId");
        localStorage.removeItem("username");
        localStorage.removeItem("password");
        if(userId === '1'){
            //window.location.href='/app/adminindex';
            //window.location.href='/app/adminindex';
            window.parent.location.href='/app/'
        }else{
            //window.location.href='/app/merchantindex';
            window.parent.location.href='/app/'
        }
    }


</script>

</html>